Sometimes we need mouseover effect for two images or more. For pure-css image galleries with thumbnail or comparison of before-later photos or photoshop effects like dark-light etc... Be sure that all images have same image width-height. We use an empty container with fixed width-height. We set the first image as background and the second one as hover-background. Demo
Example page code:
Mouseover Images with CSS
This is an example, how to use two background-images to make javascript-like mouseover effect. We use two background-images; the second one appears just when mouse comes over div-area.